<template>
  <div class="admin">
    <head-Top :params="params"></head-Top>
    <div class="container">
        <div class="menu-left">
            <el-menu class="ml" :default-active="$route.path" text-color="#ffffff" active-text-color="#ffd04b" router>
                <el-menu-item index="/admin/home" class="mlc"><i class="el-icon-menu"></i>首页</el-menu-item>
                <el-submenu index="2" class="mlc">
                    <template slot="title"><i class="el-icon-document"></i>考试管理</template>
                    <el-menu-item index="/admin/generateTexePaper" class="mlcc">创建试卷</el-menu-item>
                    <el-menu-item index="/admin/releaseExam" class="mlcc">发布单科考试</el-menu-item>
                    <el-menu-item index="/admin/integrationExam" class="mlcc">整合考试</el-menu-item>
                    <el-menu-item index="/teaInfManage" class="mlcc">考试成绩管理</el-menu-item>
                </el-submenu>
            </el-menu>
        </div>

        <keep-alive>
            <router-view></router-view>
        </keep-alive>
    </div>
    

  </div>
</template>

<script>
import headTop from '../../components/headTop.vue'
export default {
    data() {
        return {
          params: []
        }
    },
    components: {
        headTop
    },
    created (){
      this.params = JSON.parse(window.localStorage.getItem('userInfo'))
    },
    methods: {
  
    }
}
</script>

<style lang='stylus'>
body, html,
.app, .admin
  width 100%
  height 100%
  .container
    display flex
    width 100%
    height calc(100% - 52px)
    .menu-left
      flex-shrink: 0;
      width 235px
      background-color #50a3a2
      user-select none
      height 100%
      .ml
        height 56px
        line-height 56px
        .el-icon-arrow-down
          color #ffffff
        .mlc
          background-color #50a3a2
        .mlcc
          background-color #378c8b
        :hover
          background-color #5eb3b3
</style>